<template>
  <div class="body1">
    <div>
      <!--轮播图组件 -->
      <mt-swipe :auto="4000">
        <mt-swipe-item>
          <img src="../assets/img/shuijiao.jpg" />
        </mt-swipe-item>
        <mt-swipe-item>
          <img src="../assets/img/cbd.jpg" />
        </mt-swipe-item>
        <mt-swipe-item>
          <img src="../assets/img/muwu.jpg" />
        </mt-swipe-item>
        <mt-swipe-item>
          <img src="../assets/img/yuantiao.jpg" />
        </mt-swipe-item>
      </mt-swipe>
    </div>
    <div>
      <ul class="mui-table-view mui-grid-view mui-grid-9">
        <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
          <router-link to="/home/news">
            <span class="mui-icon mui-icon-home"></span>
            <div class="mui-media-body">新闻资讯</div>
          </router-link>
        </li>
        <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
          <router-link to="/home/photo">
            <span class="mui-icon mui-icon-email">
              <span class="mui-badge">5</span>
            </span>
            <div class="mui-media-body">图片</div>
          </router-link>
        </li>
        <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
          <router-link to="#">
            <span class="mui-icon mui-icon-chatbubble"></span>
            <div class="mui-media-body">Chat</div>
          </router-link>
        </li>
        <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
          <router-link to="#">
            <span class="mui-icon mui-icon-location"></span>
            <div class="mui-media-body">location</div>
          </router-link>
        </li>
        <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
          <router-link to="#">
            <span class="mui-icon mui-icon-search"></span>
            <div class="mui-media-body">Search</div>
          </router-link>
        </li>
        <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
          <router-link to="#">
            <span class="mui-icon mui-icon-phone"></span>
            <div class="mui-media-body">Phone</div>
          </router-link>
        </li>
      </ul>
    </div>
  </div>

  <!-- 六宫格组件 -->
</template>
<script>
export default {
  
};
</script>
<style  scoped>

.mint-swipe {
  height: 200px;
}
.mint-swipe-item img {
  width: 100%;
}
.mui-grid-view.mui-grid-9{
  background-color: #fff;
  border: 0;

}
.mui-grid-view.mui-grid-9 .mui-table-view-cell{
  border: 0;
}
.mui-table-view.mui-grid-view .mui-table-view-cell .mui-media-body {
  font-size: 12px;
}
</style>